<template>
    <el-select
    @change="changeChannel"
    v-model="channeId"
    :value="value"
      placeholder="请选择"
      clearable
    >
      <el-option
        v-for="item in optionsList"
        :key="item.id"
        :label="item.label"
        :value="item.name"
      >
      </el-option>
    </el-select>
  </template>

<script>
import { listInfoAPI } from '@/api/index.js'
export default {
  name: 'MyChannel',
  data () {
    return {
    //   channelId: null,
      optionsList: []
    }
  },
  props: ['value'],
  created () {
    this.getChannelOptions()
  },
  methods: {
    changeChannel (changedChannelId) {
      // 通知父组件，频道ID已变化，你也需要改变
      this.$emit('input', changedChannelId)
    },
    // 频道列表
    async getChannelOptions () {
      try {
        const { data: res } = await listInfoAPI()
        this.optionsList = res.data.channels
        console.log(res)
      } catch (error) {
        console.log(error)
      }
    }
  }
}
</script>

  <style scoped lang='less'></style>
